<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="UTF-8">
    <title>商品列表</title>
		<script th:src="@{/layui/layui.js}" type="text/javascript"></script>
		<link th:href="@{/layui/css/layui.css}" rel="stylesheet" />
	</head>
<body>
	<div class="layui-panel" style="padding: 8px;">
	    <fieldset class="layui-elem-field layui-border-blue">
	        <legend>搜索信息</legend>
	        <form class="layui-form layui-form-pane" style="margin: 20px;">
	            <div class="layui-form-item">
	                <div class="layui-inline">
	                    <label class="layui-form-label">商品名称</label>
	                    <div class="layui-input-inline">
	                        <input class="layui-input" type="text" name="name" autocomplete="off" />
	                    </div>
	                </div>
	                <div class="layui-inline">
	                    <div class="layui-input-inline">
	                        <a class="layui-btn layui-btn-primary" lay-submit="" lay-filter="searchBtn">
	                            <i class="layui-icon layui-icon-search"></i>
	                            搜索
	                        </a>
	                    </div>
	                </div>
	            </div>
	        </form>
	    </fieldset>
	    <div>
	        <table id="goodsListTable" lay-filter="goodsListTable"></table>
	    </div>
	</div>
	<!---->
	<script id="tool" type="text/html">
		<a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="edit">编辑</a>
		<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
	</script>
	<!---->
	<script id="tableBar" type="text/html">
	    <a class="layui-btn layui-btn-normal layui-btn-md" lay-event="add">
	        <i class="layui-icon layui-icon-add-1"></i>
	        新增
	    </a>
	    <a class="layui-btn layui-btn-danger layui-btn-md" lay-event="delete">
	        <i class="layui-icon layui-icon-delete"></i>
	        删除
	    </a>
	</script>
	<!---->

	<script id="picUrl" type="text/html">
		<img src="/file/fc/showImg/{{d.picUrl}}" style="border-radius: 25px;width: 25px;height: 25px">
	</script>
	<script id="gallery" type="text/html">
		<img src="/file/fc/showImg/{{d.gallery}}" style="border-radius: 25px;width: 25px;height: 25px">
	</script>
<script>
		var $,active;
		layui.use(['table','form','laydate','layer','dropdown','jquery'],function(){
			
        	var table = layui.table,form = layui.form,layer = layui.layer,
            	laydate = layui.laydate,dropdown = layui.dropdown;
        		$ = layui.jquery;
            	
			laydate.render({
				elem:'#endDate'
			})
			laydate.render({
				elem:'#endDate'
			})
			
			//加载动态表格
			table.render({
				
				elem:'#goodsListTable',
				height:'full-160',
				page:true,
				toolbar:'#tableBar',
				url:'/goods/gc/find',
				cols:[
					[
					{type:'numbers',fixed:'left'},
					{type:'checkbox',fixed:'left'},
					{field:'goodsSn',title:'商品编号',width:100,align: 'center'},
					{field:'name',title:'商品名称',width:180,align: 'center'},
					{field:'picUrl',title:'图片',width:80,align: 'center',templet:'#picUrl'},
					{field:'detail',title:'商品描述',align: 'center'},
					{field:'marketPrice',title:'市场售价',width:100,align: 'center'},
					{field:'currentPrice',title:'当前价格',width:100,align: 'center'},
					{field:'isNew',title:'是否新品',align: 'center',width:180,
						templet:function(obj){
							var isNew = obj.isNew;
							var str = "";
							if(isNew == 0){
								str = "<span style='color:#02F78E'>新品</span>"
							}else{
								str = "<span style='color:#0080FF'>非新品</span>"
							}
							return str;
						}
					
					},
					{field:'isHot',title:'是否热品',align: 'center',width:180,
						templet:function(obj){
							var isHot = obj.isHot;
							var str = "";
							if(isHot == 0){
								str = "<span style='color:#02F78E'>热品</span>"
							}else{
								str = "<span style='color:#0080FF'>非热品</span>"
							}
							return str;
						}
					
					},
					{field:'onSale',title:'是否在售',align: 'center',width:180,
						templet:function(obj){
							var onSale = obj.onSale;
							var str = "";
							if(onSale == 0){
								str = "<span style='color:#02F78E'>在售</span>"
							}else{
								str = "<span style='color:#0080FF'>非在售</span>"
							}
							return str;
						}
					
					},
					{fixed:'right',title:'操作',width:150,align:'center',toolbar:'#tool'},
				]
				]
				
			});

			//
			form.on('submit(searchBtn)',function(data){
				var dataForm = data.field;
				table.reload('goodsListTable',{
					page: {
						curr:1
					},
					where:{
						name:dataForm.name
					}
				})
			})



			active = {
				addOrUpdate:function (title,btn,content) {
					var b = false;
					top.layer.open({
						title:title,
						type:2,
						content:content,
						area:['900px','750px'],
						btn:[btn,'取消关闭'],
						btn1:function (i,o) {
							b = true;
							o.find('iframe')[0].contentWindow.btnSubmit();
						},
						end:function (i,o) {
							if (b) layui.table.reload('goodsListTable');
						}
					})
				},
				deleteConfirm:function (ids) {

					layer.confirm('确定删除'+(ids.length==1?'该记录':'这些记录')+'吗？',function (index) {
						if (index>0){
							$.ajax({
								type:'post',
								url:'/goods/gc/batchUpdate',
								data:{
									ids:ids
								},
								dataType:'json',
								success:function (result) {
									layer.msg(result.msg);
									if (result.is){
										layui.table.reload('goodsListTable');
									}
								}
							})
						}
					});

				}
			}

			//add
			table.on('toolbar(goodsListTable)',function (obj) {
				var event = obj.event;
				if ("add"==event){
					active.addOrUpdate('新增商品','确认添加','/page/goods/goodsAdd');
				}
				else if ('delete' == event){
					var checkStatus = table.checkStatus(obj.config.id);
					if (checkStatus.data.length>0){
						var ids = [];
						$.each(checkStatus.data,function (i,cs) {
							ids.push(cs.id);
						});

						active.deleteConfirm(ids);
					}else {
						layer.msg("请选择要删除的记录！");
					}


				}
			});

			table.on('tool(goodsListTable)',function (obj) {
				var event = obj.event;

				if ("edit" == event){
					active.addOrUpdate('更新商品','保存更新','/page/goods/goodsEdit/'+obj.data.id);
				}
				else if ('delete' == event){
					var ids = [];
					ids.push(obj.data.id);
					active.deleteConfirm(ids);
				}

			})
		});
	
</script>
	
	
	</body>
</html>
